<template>
  <div>
    <!--右边-->
    <div class="h-27">
      <div class="h-32 h1-32">
        <div class="h-33">
          <div class="k-2">我的收藏</div>
        </div>
        <ul class="h-34 j-2">
          <li v-for="(item,index) in rows" :key="index">
            <a href="javascript:;">
              <div class="h-38">
                <div class="h-35">
                  <span class="h-36">{{item.hzjyProduct.productName}}</span>
                  <span class="h-37">
                    <img src="@/assets/image/fa-eye.png" />
                    <span>{{item.hzjyProduct.seeNum}}</span>
                  </span>
                </div>
                <div class="h-39">{{item.hzjyProduct.delistText}}</div>
                <div class="h-40">
                  <div class="h-41">
                    <div class="h-42">挂牌类型</div>
                    <div class="h-43">{{item.tradingType==0?'作品挂牌':'项目挂牌'}}</div>
                  </div>
                  <div class="h-41">
                    <div class="h-42">许可</div>
                    <div class="h-43">{{item.hzjyProduct.permissionType==0?'专有许可':'非专有许可'}}</div>
                  </div>
                  <div class="h-41">
                    <div class="h-42">出让专利</div>
                    <div class="h-43">{{item.hzjyProduct.termType==0?'转让有限期':'许可有限期'}}</div>
                  </div>
                  <div class="h-41">
                    <div class="h-42">作品类型</div>
                    <div class="h-43">{{item.hzjyProduct.tradingType==0?'作品':'项目'}}</div>
                  </div>
                  <div class="h-41">
                    <div class="h-42">授权期限</div>
                    <div class="h-43">{{item.hzjyProduct.createTime}}</div>
                  </div>
                </div>
              </div>

              <object class="h-44">
                <!-- item.hzjyProduct.state<5&& -->
                <a
                  href="javascript:;"
                  class="h-45"
                  v-if="item.hzjyProduct.myTradingTypeWork==0"
                  @click="delistApplys(item.hzjyProduct.productId)"
                >申请摘牌</a>
                <a
                  href="javascript:;"
                  class="h-45"
                  v-if="item.hzjyProduct.myTradingTypeWork==2"
                  @click="delistApply(item.hzjyProduct.productId)"
                >查看摘牌</a>
                <div class="j-1">
                  <a
                    href="javascript:;"
                    class="h-47"
                    v-if="item.hzjyProduct.myTradingTypeWork==1&&item.hzjyProduct.state==0 || item.hzjyProduct.state==1 || item.hzjyProduct.state==2 || item.hzjyProduct.state==3 || item.hzjyProduct.state==4"
                    @click="edit(item.hzjyProduct.productId)"
                  >编辑</a>
                  <i
                    :class=" item.like?'':'active' "
                    @click="Closesc(index,item.hzjyProduct.productId)"
                  ></i>
                </div>

                <a
                  href="javascript:;"
                  class="h-46"
                  @click="signProject(item)"
                  v-if="item.hzjyProduct.state==4&&item.hzjyProduct.myTradingTypeWork==1"
                >签订</a>
                <a
                  href="javascript:;"
                  class="h-46"
                  @click="submitCheck(item)"
                  v-if="item.hzjyProduct.state==0 || item.hzjyProduct.state==3&&item.hzjyProduct.myTradingTypeWork==1"
                >提交审核</a>
                <a
                  href="javascript:;"
                  class="h-46"
                  @click="changeUPstate(item)"
                  v-if="(item.hzjyProduct.state==6|| item.hzjyProduct.state==7 || item.hzjyProduct.state==8) && item.upState==0&&item.hzjyProduct.myTradingTypeWork==1"
                >下架</a>
                <a
                  href="javascript:;"
                  class="h-46"
                  @click="changeUPstate(item)"
                  v-if="(item.hzjyProduct.state==6|| item.hzjyProduct.state==7 || item.hzjyProduct.state==8) && item.upState==1&&item.hzjyProduct.myTradingTypeWork==1"
                >上架</a>

                <a href="javascript:;" class="h-47">{{item.empower_type==1?'全部转让':'部分转让'}}</a>
              </object>
              <!-- 挂牌 -->
              <div class="a-28" v-if="item.hzjyProduct.myTradingTypeWork==1">
                <span v-if="item.hzjyProduct.state==0">草稿</span>
                <span v-if="item.hzjyProduct.state==1">被驳回</span>
                <span v-if="item.hzjyProduct.state==2">待审核</span>
                <span v-if="item.hzjyProduct.state==3">初审通过</span>
                <span v-if="item.hzjyProduct.state==4">终审通过</span>
                <span v-if="item.hzjyProduct.state==5">签订完成</span>
                <span v-if="item.hzjyProduct.state==6">部分交易完成</span>
                <span v-if="item.hzjyProduct.state==7">全部交易完成</span>
              </div>
              <!-- 摘牌 -->
              <div class="a-28" v-if="item.hzjyProduct.myTradingTypeWork==2">
                <span v-if="item.hzjyProduct.state==1">被驳回</span>
                <span v-if="item.hzjyProduct.state==2">待审核</span>
                <span v-if="item.hzjyProduct.state==3">初审通过</span>
                <span v-if="item.hzjyProduct.state==4">终审通过</span>
                <span v-if="item.hzjyProduct.state==5">价格磋商完成</span>
                <span v-if="item.hzjyProduct.state==6">协议签订并付款完成</span>
                <span v-if="item.hzjyProduct.state==7">挂牌方确认收款</span>
                <span v-if="item.hzjyProduct.state==8">摘牌成功</span>
              </div>
            </a>
          </li>
        </ul>
        <div class="a-35 h-48">
          <mo-paging
            :page-index="currentPage"
            :total="totalPage"
            :page-size="pageSize"
            @change="pageChange"
          ></mo-paging>
        </div>
      </div>
    </div>
    <div style="clear: both;"></div>
  </div>
</template>

<script>
import {
  tradinglist,
  tradingCont,
  upTrading,
  lowTrading,
  submitApprove,
} from "@/api/myTrading";
import moment from "moment";
import http from "@/api/home";
import MoPaging from "@/views/Page";
export default {
  name: "myCollection",
  components: {
    MoPaging,
  },
  data() {
    return {
      rows: Array,
      pageSize: 1, //每页显示20条数据
      totalPage: 1, //总记录数
      currentPage: 1, //作品与项目挂牌当前页码
      projectName: null,
      contractNo: null,
    };
  },
  methods: {
    // 签约
    signProject(item) {
      this.$router.push("/test");
      // this.signDialog = true;
      let urls = this.url;

      //this.loadFile(urls);
    },
    //提交
    submitCheck(data) {
      let param = { product_id: data.productId };
      submitApprove(param).then((res) => {
        if (res.code == 200) {
          _self.$message({
            message: "提交审核成功，请等待审核",
            type: "success",
          });
          _self.init();
        }
      });
    },
    //上/下架
    changeUPstate(data) {
      let param = { product_id: data.productId };
      console.log(param);

      if (data.upState == 0) {
        //执行上架
        upTrading(param).then((res) => {
          if (res.code == 200) {
            _self.$message({
              message: "上架成功",
              type: "success",
            });
            _self.init();
          }
        });
      } else {
        lowTrading(param).then((res) => {
          if (res.code == 200) {
            _self.$message({
              message: "下架成功",
              type: "success",
            });
            _self.init();
          }
        });
      }
    },
    //申请摘牌
    delistApplys(id) {
      console.log(id);
      this.$router.push({
        name: "delistApply",
        params: {
          product: id,
        },
      });
    },
    //查看摘牌
    delistApply(id) {
      console.log(id);
      this.$router.push({ name: "myDelist" });
      // this.$router.push({
      //   name: "editApply",
      //   params: {
      //     product: id,
      //   },
      // });
    },
    edit(e) {
      this.$router.push({
        name: "editTrading",
        query: {
          productId: e,
        },
      });
    },
    // 下一页
    pageChange(e) {
      this.currentPage = e;
      this.getSclist();
    },
    getSclist(e) {
      http
        .Sclist({
          size: 5,
          currentPage: this.currentPage,
        })
        .then((res) => {
          if (res.code == 200) {
            this.totalPage = res.data.totalPage;
            this.currentPage = res.data.currentPage;
            this.rows = res.data.collectionList;
          }
        });
    },
    Addsc() {
      http
        .Addsc({
          productId: "102",
        })
        .then((res) => {
          if (res.code == 200) {
            this.getSclist();
          }
        });
    },
    Closesc(index, e) {
      http
        .Closesc({
          productId: e,
        })
        .then((res) => {
          if (res.code == 200) {
            this.$notify({
              title: "成功",
              message: "取消收藏成功",
              type: "success",
            });
            this.rows[index].like = true;

            this.$forceUpdate();
            this.getSclist();
          } else {
            this.$notify.error({
              title: "错误",
              message: "取消失败",
            });
          }
        });
    },
  },
  created() {
    this.getSclist();
    // this.Addsc()
  },
  filters: {
    Time(value) {
      return moment(value).format("YYYY-MM-DD");
    },

    projectType(value) {
      let arr = [
        "图书",
        "期刊",
        "杂志",
        "报纸",
        "电影",
        "电视剧",
        "网剧",
        "综艺",
        "脱口秀",
        "纪录片",
        "专题片",
        "动漫",
        "少儿",
        "MTV",
        "演唱会",
      ];
      return arr[value];
    },
  },
};
</script>

<style scoped>
@import "../../css/user_listing.css";
.h-34 li > a {
  min-height: 184px !important;
}
</style>